<template>
    <el-image class="block" :style="styles" v-bind="props"/>
</template>

<script lang="ts" setup>
import {computed} from 'vue'
import {addUnit} from '@/utils/util'
import {ImageProps} from "element-plus/es/components/image/src/image";

interface ImageContainInterface extends ImageProps {
    width?: string | number
    height?: string | number
    radius?: string | number
}

const props = withDefaults(defineProps<ImageContainInterface>(), {
    width: 'auto',
    height: 'auto',
    radius: '0'
    
})

const styles = computed(() => {
    return {
        width: addUnit(props.width),
        height: addUnit(props.height),
        borderRadius: addUnit(props.radius)
    }
})
</script>


